<!--
 * @Description: 代理商管理
 * @Author: DXV-RGWU-TUFH-RFCY-IEGMYY
 * @Date: 2022-10-27 13:20:33
 * @LastEditTime: 2023-08-30 11:16:47
 * @LastEditors: DXV-RGWU-TUFH-RFCY-IEGMYY
-->

<template>
  <div class="lb-shop-order">
    <top-nav />
    <div class="page-main">
      <el-row class="page-top-operate">
        <lb-button
          size="medium"
          type="primary"
          icon="el-icon-plus"
          @click="toShowDialog('sub')"
          v-hasPermi="`${$route.name}-add`"
          >{{ $t('menu.AgentAccountAdd') }}</lb-button
        >
      </el-row>
      <el-row class="page-search-form">
        <el-form
          @submit.native.prevent
          :inline="true"
          :model="searchForm.list"
          ref="listForm"
        >
          <el-form-item label="账号名称" prop="username">
            <el-input
              v-model="searchForm.list.username"
              placeholder="请输入账号名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="关联用户" prop="nickName">
            <el-input
              v-model="searchForm.list.nickName"
              placeholder="请输入关联用户"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <lb-button
              size="medium"
              type="primary"
              icon="el-icon-search"
              style="margin-right: 5px"
              @click="getTableDataList(1, 'list')"
              >{{ $t('action.search') }}</lb-button
            >
            <lb-button
              size="medium"
              icon="el-icon-refresh-left"
              style="margin-right: 5px"
              @click="resetForm('list')"
              >{{ $t('action.reset') }}</lb-button
            >
          </el-form-item>
        </el-form>
      </el-row>
      <el-table
        v-loading="loading.list"
        :data="tableData.list"
        :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
        style="width: 100%"
      >
        <el-table-column prop="id" label="ID" fixed></el-table-column>
        <el-table-column
          prop="username"
          label="账号名称"
          min-width="120"
        ></el-table-column>
        <el-table-column
          prop="passwd_text"
          label="账号密码"
          min-width="120"
        ></el-table-column>
        <el-table-column
          prop="agent_name"
          label="真实姓名"
          min-width="120"
        ></el-table-column>
        <el-table-column
          prop="merchant_name"
          label="商家名称"
          min-width="120"
        ></el-table-column>
        <el-table-column prop="city_type" label="代理等级" min-width="120">
          <template slot-scope="scope">
            <el-tag :type="cityType[scope.row.city_type].type">{{
              cityType[scope.row.city_type].text
            }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="city" label="省/城市/区县" min-width="120">
          <template slot-scope="scope">
            <div>
              {{
                scope.row.city_type === 3
                  ? scope.row.province
                  : scope.row.city_type === 1
                  ? scope.row.city_id
                    ? `${scope.row.province} ${scope.row.city}`
                    : '-'
                  : scope.row.city_id
                  ? scope.row.province
                    ? `${scope.row.province} ${scope.row.city} ${scope.row.area}`
                    : `${scope.row.city} ${scope.row.area}`
                  : '-'
              }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="user_id"
          label="关联用户ID"
          min-width="120"
        ></el-table-column>
        <el-table-column
          prop="nickName"
          label="关联用户昵称"
          min-width="120"
        ></el-table-column>
        <el-table-column
          prop="phone"
          label="服务电话"
          min-width="120"
        ></el-table-column>
        <el-table-column prop="balance" label="平台抽成比例" min-width="120">
          <template slot-scope="scope">
            <div>{{ scope.row.balance }}%</div>
          </template>
        </el-table-column>
        <el-table-column
          prop="admin_pid"
          label="上级代理账号名称"
          min-width="150"
        >
          <template slot-scope="scope">
            <div>{{ scope.row.admin_pid ? scope.row.admin_ptitle : '-' }}</div>
          </template>
        </el-table-column>
        <el-table-column prop="balance" label="上级代理抽成" min-width="120">
          <template slot-scope="scope">
            <div>
              {{ scope.row.admin_pid ? `${scope.row.level_balance}%` : '-' }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="create_time" label="创建时间" min-width="120">
          <template slot-scope="scope">
            <p>{{ scope.row.create_time | handleTime(1) }}</p>
            <p>{{ scope.row.create_time | handleTime(2) }}</p>
          </template>
        </el-table-column>
        <el-table-column label="操作" min-width="160">
          <template slot-scope="scope">
            <div class="table-operate">
              <lb-button
                size="mini"
                type="primary"
                plain
                @click="toShowDialog('sub', scope.row)"
                v-hasPermi="`${$route.name}-edit`"
                >{{ $t('action.edit') }}</lb-button
              >
              <lb-button
                size="mini"
                plain
                type="danger"
                @click="confirmDel(scope.row.id)"
                v-hasPermi="`${$route.name}-delete`"
                >{{ $t('action.delete') }}</lb-button
              >
            </div>
          </template>
        </el-table-column>
      </el-table>

      <lb-page
        :batch="false"
        :page="searchForm.list.page"
        :pageSize="searchForm.list.limit"
        :total="total.list"
        @handleSizeChange="handleSizeChange($event, 'list')"
        @handleCurrentChange="handleCurrentChange($event, 'list')"
      >
      </lb-page>
    </div>
    <!-- 新增/编辑账号 -->
    <el-dialog
      :title="$t(subForm.id ? 'menu.AgentAccountEdit' : 'menu.AgentAccountAdd')"
      :visible.sync="showDialog.sub"
      width="800px"
      center
      :append-to-body="true"
    >
      <lb-tips>
        提成方式计算规则
        <!-- <el-popover placement="top-start" width="750" trigger="hover">
          <div class="f-caption c-title" slot>
            <p class="mb-sm">例如：订单实付金额为100元（不含车费）</p>
            <p class="mb-sm">
              1、{{
                $t('action.attendantName')
              }}提成比例70%，分销合伙人提成比例为10%，平台提成比例为20%
            </p>
            <p class="mb-md c-warning" style="margin-left: 20px">
              当 {{ $t('action.attendantName') }}提成比例 + 分销合伙人提成比例 +
              平台提成比例 >= 100% 时，代理商无提成
            </p>
            <p class="mb-sm">
              2、{{
                $t('action.attendantName')
              }}提成比例60%，分销合伙人提成比例为5%，平台提成比例为10%
            </p>
            <p class="mb-sm c-warning" style="margin-left: 20px">
              (1)、当代理商代理等级为省时：
            </p>
            <p class="mb-sm c-link" style="margin-left: 50px">
              省代理商提成金额 = 100 * ( 100 - 60 - 5 - 10)%
            </p>
            <p class="mb-sm c-link" style="margin-left: 150px">= 100 * 25%</p>
            <p class="mb-sm c-link" style="margin-left: 150px">= 25元</p>
            <p class="mb-sm c-warning" style="margin-left: 20px">
              (2)、当代理商代理等级为城市时：
            </p>
            <p class="mb-sm c-warning" style="margin-left: 50px">
              1)、上级省代理商提成比例25%
            </p>
            <p class="mb-md c-link" style="margin-left: 80px">
              当 {{ $t('action.attendantName') }}提成比例 + 分销合伙人提成比例 +
              平台提成比例 + 上级省代理商提成比例 >= 100% 时，城市代理商无提成
            </p>
            <p class="mb-sm c-warning" style="margin-left: 50px">
              2)、上级省代理商提成比例12%
            </p>
            <p class="mb-sm c-link" style="margin-left: 80px">
              城市代理商提成金额 = 100 * ( 100 - 60 - 5 - 10 - 12)%
            </p>
            <p class="mb-sm c-link" style="margin-left: 193px">= 100 * 13%</p>
            <p class="mb-sm c-link" style="margin-left: 193px">= 13元</p>
            <p class="mb-sm c-warning" style="margin-left: 20px">
              (3)、当代理商代理等级为区县时：
            </p>
            <p class="mb-sm c-warning" style="margin-left: 50px">
              1)、上级省代理商提成比例为15%，上级城市代理商提成比例10%
            </p>
            <p class="mb-md c-link" style="margin-left: 80px">
              当 {{ $t('action.attendantName') }}提成比例 + 分销合伙人提成比例 +
              平台提成比例 + 上级省代理商提成比例 + 上级城市代理商提成比例 >=
              100% 时，区县代理商无提成
            </p>
            <p class="mb-sm c-warning" style="margin-left: 50px">
              2)、上级省代理商提成比例为8%，上级城市代理商提成比例5%
            </p>
            <p class="mb-sm c-link" style="margin-left: 80px">
              区县代理商提成金额 = 100 * ( 100 - 60 - 5 - 10 - 8 - 5)%
            </p>
            <p class="mb-sm c-link" style="margin-left: 193px">= 100 * 12%</p>
            <p class="mb-sm c-link" style="margin-left: 193px">= 12元</p>
          </div>
          <i class="el-icon-question" style="color: #000" slot="reference"></i>
        </el-popover> -->
        ：{{ $t('action.attendantName') }}提成 > 分销合伙人提成 >
        {{ $t('action.attendantName') }}经纪人提成 > 渠道商提成 > 业务员提成 >
        平台提成 > 省代理商 > 城市代理商 > 区县代理商
      </lb-tips>
      <el-form
        :model="subForm"
        :rules="subFormRules"
        ref="subForm"
        label-width="170px"
        class="dialog-form"
      >
        <el-form-item label="账号" prop="username">
          <el-input
            v-model="subForm.username"
            placeholder="请输入账号"
            maxlength="20"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="passwd_text">
          <el-input
            v-model="subForm.passwd_text"
            placeholder="请输入密码"
            maxlength="20"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="真实姓名" prop="agent_name">
          <el-input
            v-model="subForm.agent_name"
            placeholder="请输入真实姓名"
            maxlength="20"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="商家名称" prop="merchant_name">
          <el-input
            v-model="subForm.merchant_name"
            placeholder="请输入商家名称"
            maxlength="20"
            show-word-limit
          ></el-input>
        </el-form-item>
        <el-form-item label="营业执照" prop="license">
          <lb-cover
            :fileList="subForm.license"
            @selectedFiles="getCover"
          ></lb-cover>
        </el-form-item>
        <el-form-item label="代理等级" prop="city_type">
          <el-radio-group
            @change="getCityList($event)"
            v-model="subForm.city_type"
          >
            <el-radio :label="3">省代理</el-radio>
            <el-radio :label="1">城市代理</el-radio>
            <el-radio :label="2">区县代理</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          :label="`选择${cityType[subForm.city_type].text}`"
          prop="city_data"
        >
          <el-cascader
            size="large"
            :options="base_city"
            v-model="subForm.city_data"
            @change="handleChange"
            :placeholder="`请选择${cityType[subForm.city_type].text}`"
            :props="{ checkStrictly: true, label: 'title', value: 'id' }"
          ></el-cascader>
        </el-form-item>
        <el-form-item label="关联用户" prop="user_id">
          <el-tag class="cursor-pointer" @click="toShowDialog('user')">{{
            subForm.user_id
              ? subForm.nickName || `用户ID ${subForm.user_id}`
              : '选择关联用户'
          }}</el-tag>
        </el-form-item>
        <el-form-item label="服务电话" prop="phone">
          <el-input
            v-model="subForm.phone"
            placeholder="请输入服务电话"
          ></el-input>
          <lb-tool-tips
            >代理商服务电话用于客户咨询，请填写有效的联系电话</lb-tool-tips
          >
        </el-form-item>
        <el-form-item label="平台抽成比例" prop="balance">
          <el-input-number
            class="lb-input-number"
            :min="0"
            :max="100"
            :precision="0"
            :controls="false"
            v-model="subForm.balance"
            placeholder="请输入平台抽成比例"
          ></el-input-number>
          <block>%</block>
          <lb-tool-tips>
            <p class="mb-sm">平台抽成取值0%到100%</p>
            <p class="mb-sm">
              设置为0%，表示平台不抽成，除去{{
                $t('action.attendantName')
              }}和分销合伙人的提成后，剩下都归代理商
            </p>
            <p>
              设置100%，则表示代理商无提成，除去{{
                $t('action.attendantName')
              }}和代理商的提成后，剩下都归平台
            </p>
          </lb-tool-tips>
        </el-form-item>
        <el-form-item
          label="关联上级代理"
          prop=""
          v-if="subForm.city_type !== 3 && subForm.city_data.length > 0"
        >
          <el-tag class="cursor-pointer" @click="toShowDialog('pid')">{{
            subForm.admin_pid ? subForm.admin_ptitle : '选择关联上级代理'
          }}</el-tag>
        </el-form-item>
        <el-form-item
          label="上级代理抽成"
          prop="level_balance"
          v-if="subForm.city_type !== 3 && subForm.admin_pid"
        >
          <el-input-number
            class="lb-input-number"
            :min="0"
            :max="100"
            :precision="0"
            :controls="false"
            v-model="subForm.level_balance"
            placeholder="请输入上级代理抽成"
          ></el-input-number>
          <block>%</block>

          <lb-tool-tips
            >{{
              cityType[subForm.city_type].text
            }}代理需要分给上级代理的比例。例如{{
              cityType[subForm.city_type].text
            }}代理可分得40%
            <div class="mt-sm">
              如果设置了上级抽成10%，则{{
                cityType[subForm.city_type].text
              }}代理只分得30%
            </div>
          </lb-tool-tips>
        </el-form-item>
        <el-form-item label="管理员授权个数" prop="phone_admin_num">
          <el-input
            v-model="subForm.phone_admin_num"
            placeholder="请输入管理员授权个数"
          ></el-input>
          <lb-tool-tips
            >代理商可添加手机端管理员的个数，添加的管理员可协助代理商管理订单</lb-tool-tips
          >
        </el-form-item>
        <el-form-item label="查看真实号码" prop="phone_encryption">
          <el-radio-group v-model="subForm.phone_encryption">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
          <lb-tool-tips
            >开启之后，该代理商能在自己的后台看到订单里的真实电话号码</lb-tool-tips
          >
        </el-form-item>
        <el-form-item label="邀请业务员" prop="salesman_auth">
          <el-radio-group v-model="subForm.salesman_auth">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
          <lb-tool-tips
            >开启之后，该代理商能在自己的手机端邀请业务员，并在后台审核业务员申请</lb-tool-tips
          >
        </el-form-item>
        <el-form-item label="邀请渠道商" prop="channel_auth">
          <el-radio-group v-model="subForm.channel_auth">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
          <lb-tool-tips
            >开启之后，该代理商能在自己的手机端邀请渠道商，并在后台审核渠道商申请</lb-tool-tips
          >
        </el-form-item>
        <el-form-item
          :label="'经纪人拉' + $t('action.attendantName')"
          prop="partner_auth"
        >
          <el-radio-group v-model="subForm.partner_auth">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
          <lb-tool-tips
            >开启之后，该经纪人能帮该代理商拉{{
              $t('action.attendantName')
            }}，同时该代理商需要分佣给该{{
              $t('action.attendantName')
            }}经纪人</lb-tool-tips
          >
        </el-form-item>
        <el-form-item label="代理商操作提现权限" prop="wallet_check_auth">
          <el-radio-group v-model="subForm.wallet_check_auth">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
          <lb-tool-tips
            >开启之后，该代理商能在后台【财务管理 -
            提现申请】操作提现或拒绝提现除自己之外的数据</lb-tool-tips
          >
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showDialog.sub = false">{{
          $t('action.cancel')
        }}</el-button>
        <el-button
          type="primary"
          @click="submitFormInfo('sub', 1)"
          v-preventReClick
          >{{ $t('action.comfirm') }}</el-button
        >
      </div>
    </el-dialog>
    <!-- 关联用户 -->
    <el-dialog
      title="关联用户"
      :visible.sync="showDialog.user"
      width="800px"
      center
    >
      <el-form
        :inline="true"
        :model="searchForm.user"
        ref="userForm"
        label-width="70px"
      >
        <el-form-item label="输入查询" prop="nickName">
          <el-input
            v-model="searchForm.user.nickName"
            placeholder="请输入用户昵称/手机号"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <lb-button
            size="medium"
            type="primary"
            icon="el-icon-search"
            style="margin-right: 5px"
            @click="getTableDataList(1, 'user')"
            >{{ $t('action.search') }}</lb-button
          >
          <lb-button
            size="medium"
            icon="el-icon-refresh-left"
            style="margin-right: 5px"
            @click="resetForm('user')"
            >{{ $t('action.reset') }}</lb-button
          >
        </el-form-item>
      </el-form>
      <el-table
        v-loading="loading.user"
        :data="tableData.user"
        ref="singleTable"
        :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
        tooltip-effect="dark"
        style="width: 100%"
        highlight-current-row
        @current-change="handleTableChange($event, 'user')"
      >
        <el-table-column prop="id" label="用户ID"></el-table-column>
        <el-table-column prop="avatarUrl" label="头像">
          <template slot-scope="scope">
            <lb-image :src="scope.row.avatarUrl" />
          </template>
        </el-table-column>
        <el-table-column prop="nickName" label="昵称"></el-table-column>
        <el-table-column prop="phone" label="手机号"></el-table-column>
      </el-table>
      <lb-page
        :batch="false"
        :page="searchForm.user.page"
        :pageSize="searchForm.user.limit"
        :total="total.user"
        @handleSizeChange="handleSizeChange($event, 'user')"
        @handleCurrentChange="handleCurrentChange($event, 'user')"
      >
      </lb-page>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDialog.user = false">取 消</el-button>
        <el-button
          type="primary"
          @click="submitFormInfo('user', 2)"
          v-preventReClick
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 关联上级代理 -->
    <el-dialog
      title="关联上级代理"
      :visible.sync="showDialog.pid"
      width="800px"
      center
    >
      <el-form
        :inline="true"
        :model="searchForm.pid"
        ref="pidForm"
        label-width="70px"
      >
        <el-form-item label="输入查询" prop="username">
          <el-input
            v-model="searchForm.pid.username"
            placeholder="请输入账号名称"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <lb-button
            size="medium"
            type="primary"
            icon="el-icon-search"
            style="margin-right: 5px"
            @click="getTableDataList(1, 'pid')"
            >{{ $t('action.search') }}</lb-button
          >
          <lb-button
            size="medium"
            icon="el-icon-refresh-left"
            style="margin-right: 5px"
            @click="resetForm('pid')"
            >{{ $t('action.reset') }}</lb-button
          >
        </el-form-item>
      </el-form>
      <el-table
        v-loading="loading.pid"
        :data="tableData.pid"
        ref="singleTable"
        :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
        tooltip-effect="dark"
        style="width: 100%"
        highlight-current-row
        @current-change="handleTableChange($event, 'pid')"
      >
        <el-table-column prop="user_id" label="用户ID"></el-table-column>
        <el-table-column prop="nickName" label="用户昵称"></el-table-column>
        <el-table-column prop="username" label="账号名称"></el-table-column>
      </el-table>
      <lb-page
        :batch="false"
        :page="searchForm.pid.page"
        :pageSize="searchForm.pid.limit"
        :total="total.pid"
        @handleSizeChange="handleSizeChange($event, 'pid')"
        @handleCurrentChange="handleCurrentChange($event, 'pid')"
      >
      </lb-page>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDialog.pid = false">取 消</el-button>
        <el-button
          type="primary"
          @click="submitFormInfo('pid', 2)"
          v-preventReClick
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import moment from 'moment'
export default {
  data () {
    return {
      cityType: {
        3: {
          type: 'success',
          text: '省'
        },
        1: {
          type: 'primary',
          text: '城市'
        },
        2: {
          type: 'danger',
          text: '区县'
        }
      },
      loading: { list: false, user: false, pid: false },
      searchForm: {
        list: {
          page: 1,
          limit: 10,
          username: '',
          nickName: ''
        },
        user: {
          page: 1,
          limit: 10,
          nickName: ''
        },
        pid: {
          page: 1,
          limit: 10,
          nickName: '',
          city_id: ''
        }
      },
      tableData: {
        list: [],
        user: [],
        pid: []
      },
      total: {
        list: 0,
        user: 0,
        pid: 0
      },
      currentRow: {},
      base_city: [],
      showDialog: { sub: false, user: false, pid: false },
      subForm: {
        id: 0,
        username: '',
        passwd_text: '',
        agent_name: '',
        merchant_name: '',
        license: [],
        phone: '',
        city_type: 3,
        city_id: '',
        city_data: [],
        balance: '',
        admin_pid: '',
        admin_ptitle: '',
        level_balance: '',
        user_id: '',
        nickName: '',
        phone_admin_num: 0,
        phone_encryption: 0,
        salesman_auth: 0,
        channel_auth: 0,
        partner_auth: 0,
        wallet_check_auth: 0
      },
      subFormRules: {
        username: { required: true, validator: this.$reg.isNotNull, reg_type: 2, text: '账号', trigger: 'blur' },
        passwd_text: { required: true, type: 'string', message: '请输入密码', trigger: 'blur' },
        agent_name: { required: true, validator: this.$reg.isNotNull, reg_type: 2, text: '真实姓名', trigger: 'blur' },
        phone: { required: true, validator: this.$reg.isTel, text: '服务电话', trigger: 'blur' },
        city_type: { required: true, type: 'number', message: '请选择代理等级', trigger: 'blur' },
        balance: { required: true, type: 'number', message: '请输入平台抽成', trigger: 'blur' },
        user_id: { required: true, type: 'number', message: '请选择关联用户', trigger: 'blur' },
        phone_admin_num: { required: true, validator: this.$reg.isNum, text: '管理员授权个数', trigger: 'blur' }
      }
    }
  },
  created () {
    this.getTableDataList(1, 'list')
  },
  methods: {
    resetForm (form) {
      let name = `${form}Form`
      this.$refs[name].resetFields()
      this.getTableDataList(1, form)
    },
    handleSizeChange (val, key) {
      this.searchForm[key].limit = val
      this.handleCurrentChange(1, key)
    },
    handleCurrentChange (val, key) {
      this.searchForm[key].page = val
      this.getTableDataList('', key)
    },
    getTableDataList (flag, key) {
      if (flag) this.searchForm[key].page = 1
      this.loading[key] = true
      let searchForm = JSON.parse(JSON.stringify(this.searchForm[key]))
      if (key === 'pid') {
        let subForm = JSON.parse(JSON.stringify(this.subForm))
        let { id = 0, city_type: ctype, city_data: cdata } = subForm
        searchForm.id = id
        if (ctype !== 1) {
          cdata.splice(cdata.length - 1, 1)
        }
        searchForm.city_id = ctype === 1 ? [cdata[0]] : cdata
      }
      let methodArr = {
        list: 'franchiseeList',
        user: 'userList',
        pid: 'franchiseeList'
      }
      let methodModel = methodArr[key]
      this.$api.agent[methodModel](searchForm).then((res) => {
        this.loading[key] = false
        if (res.code === 200) {
          let { data, total } = res.data
          this.tableData[key] = data
          this.total[key] = total
        }
      })
    },
    getCover (img) {
      this.subForm.license = img
    },
    async toShowDialog (key, item = {}) {
      item = JSON.parse(JSON.stringify(item))
      if (key === 'user' || key === 'pid') {
        if (key === 'user') {
          this.searchForm.user.nickName = ''
        }
        if (key === 'pid') {
          let { city_type: ctype = 3, city_data: cdata } = this.subForm
          if ((ctype === 1 && cdata.length < 2) || (ctype === 2 && cdata.length < 3)) {
            this.$message.error(`请选择${this.cityType[ctype].text}`)
            return
          }
        }
        await this.getTableDataList(1, key)
      }
      if (key === 'sub') {
        if (!item.id) {
          item = {
            id: 0,
            username: '',
            passwd_text: '',
            agent_name: '',
            merchant_name: '',
            license: [],
            phone: '',
            city_type: 3,
            city_id: '',
            city_data: [],
            balance: '',
            admin_pid: '',
            admin_ptitle: '',
            level_balance: '',
            user_id: '',
            nickName: '',
            phone_admin_num: 0,
            phone_encryption: 0,
            salesman_auth: 0,
            channel_auth: 0,
            partner_auth: 0,
            wallet_check_auth: 0
          }
        }
        item.license = item.license && item.license.length > 0 ? [{ url: item.license }] : []
        for (let keys in this[`${key}Form`]) {
          this[`${key}Form`][keys] = item[keys]
        }
        await this.getCityList()
      }
      this.showDialog[key] = true
    },
    async getCityList (type = 0) {
      let { city_type: ctype = 3, city_data: cdata } = this.subForm
      if (type) {
        if (type === 1 && cdata.length > 2) {
          cdata.splice(2, 1)
        }
        if (type === 3 && cdata.length > 0) {
          cdata = [cdata[0]]
        }
        this.subForm.city_data = cdata
      }
      let { code, data } = await this.$api.system.citySelect({ city_type: 3 })
      if (code !== 200) return
      data.map(item => {
        if (ctype === 3) {
          delete item.children
        }
        if (item.children) {
          item.children.map(aitem => {
            if (ctype === 1 || aitem.children.length === 0) {
              delete aitem.children
            }
          })
        }
      })
      this.base_city = data
    },
    handleTableChange (val, type) {
      val = JSON.parse(JSON.stringify(val))
      let { id, nickName, username = '' } = val
      if (type === 'pid') {
        val.admin_ptitle = username
      } else {
        val.nickName = nickName || `用户ID ${id}`
      }
      this.currentRow = val
    },
    async submitFormInfo (key, validate = 1) {
      let flag = true
      if (validate === 1) {
        this.$refs[`${key}Form`].validate(valid => {
          if (!valid) flag = false
        })
      }
      if (flag) {
        if (key !== 'sub') {
          if (this.currentRow === null || !this.currentRow.id) {
            this.$message.error(key === 'user' ? `请选择用户` : `请选择上级代理`)
            return
          }
          let { id = 0, nickName = '', username = '' } = this.currentRow
          if (key === 'user') {
            this.subForm.user_id = id
            this.subForm.nickName = nickName
          } else {
            this.subForm.admin_pid = id
            this.subForm.admin_ptitle = username
          }
          this.showDialog[key] = false
          return
        }
        let { cityType } = this
        let subForm = JSON.parse(JSON.stringify(this[`${key}Form`]))
        if (subForm.username.length < 2 || subForm.passwd_text.length < 6) {
          this.$message.error(subForm.username.length < 2 ? `账号不能少于2位数` : `密码不能少于6位数`)
          return
        }
        let { city_type: ctype, city_data: cdata } = subForm
        if ((ctype === 1 && cdata.length < 2) || (ctype === 2 && cdata.length < 3) || (ctype === 3 && cdata.length === 0)) {
          this.$message.error(`请选择${cityType[ctype].text}`)
          return
        }
        subForm.city_id = cdata[cdata.length - 1]
        let balance = 100 - subForm.balance * 1
        if (subForm.admin_pid && subForm.level_balance * 1 >= balance) {
          this.$message.error(`上级代理抽成不能大于或等于当前代理提成 (当前代理提成${balance}%)`)
          return
        }
        subForm.license = subForm.license && subForm.license.length > 0 ? subForm.license[0].url : ''
        delete subForm.city_data
        delete subForm.admin_ptitle
        delete subForm.nickName
        let methodModel = subForm.id ? 'adminUpdate' : 'adminAdd'
        let { code } = await this.$api.agent[methodModel](subForm)
        if (code !== 200) return
        this.$message.success(this.$t(subForm.id ? 'tips.successRev' : 'tips.successSub'))
        this.showDialog[key] = false
        this.getTableDataList('', 'list')
      }
    },
    confirmDel (id) {
      this.$confirm(this.$t('tips.franchiseeDelete'), this.$t('tips.reminder'), {
        confirmButtonText: this.$t('action.comfirm'),
        cancelButtonText: this.$t('action.cancel'),
        type: 'warning'
      }).then(() => {
        this.$api.agent.adminStatusUpdate({ id, status: '-1' }).then((res) => {
          if (res.code === 200) {
            this.$message.success(this.$t('tips.successDel'))
            this.searchForm.list.page = this.searchForm.list.page < Math.ceil((this.total.list - 1) / this.searchForm.list.limit) ? this.searchForm.list.page : Math.ceil((this.total.list - 1) / this.searchForm.list.limit)
            this.getTableDataList('', 'list')
          }
        })
      })
    }
  },
  filters: {
    handleTime (val, type) {
      let time = type === 1 ? moment(val * 1000).format('YYYY-MM-DD') : type === 2 ? moment(val * 1000).format('HH:mm:ss') : moment(val * 1000).format('YYYY-MM-DD HH:mm:ss')
      return time
    }
  }
}
</script>

<style lang="scss">
.dialog-form {
  .el-input,
  .el-input-number {
    width: 300px;
  }
}
</style>
